import React from 'react';
import Toast from 'antd-mobile/lib/toast';
import BackNav from 'shared/components/BackNav';
import Menu from 'shared/components/Menu';
import localstorage from 'shared/utils/localstorage';
import { checkPaymentStatusApi } from 'shared/api';

export default class CheckPayStatus extends React.Component {
  componentDidMount() {
    Toast.loading('等待支付结果中', 100000);
    const data = localstorage.getObject('payRes');
    const orderId = data.order_id;
    if (!data.order_id) {
      __self.history.push('/')
    }

    this.checkPaymentCount = window.setInterval(() => this.checkPaymentStatus(orderId), 500);
  }

  componentWillUnmount() {
    localstorage.setObject('payRes', {});
    window.clearTimeout(this.checkPaymentCount);
  }

  checkPaymentStatus = (orderId) => {
    checkPaymentStatusApi(orderId).then((res) => {
      if (res.code === 1000 && res.data.ispaid) {
        window.clearTimeout(this.checkPaymentCount);
        __self.history.push('/PaymentSuccess')
      }
    })
  }

  render() {
    return [
      <BackNav key='back-nav' title="检测支付状态" hideBackButton />,
      <Menu key="menu" />
    ]
  }
}